<!DOCTYPE html>
<html lang="en" style="font-size: 111.429px;">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,viewport-fit=cover"
		name="viewport">

	<meta http-equiv="X-UA-Compatible" content="IE=Edge">
	<meta name="format-detection" content="telephone=no">
	<meta http-equiv="Pragma" content="no-cache">
	<meta http-equiv="Cache-Control" content="no-cache">
	<meta http-equiv="Expires" content="0">
	<meta name="keywords" content="">
	<meta name="description" content="">
	<meta name="referrer" content="no-referrer-when-downgrade">
	<link rel="icon" href="data:;base64,=">
	<title>菜鸟裹裹领券</title>

	<link rel="stylesheet" href="./static/styles-tc.css">
	<style class="mpa-style-fix ImageGatherer">
		.FotorFrame {
			position: fixed !important
		}
	</style>
	<style class="mpa-style-fix SideFunctionPanel">
		.weui-desktop-online-faq__wrp {
			top: 304px !important;
			bottom: unset !important
		}

		.weui-desktop-online-faq__wrp .weui-desktop-online-faq__switch {
			width: 38px !important
		}
	</style>
</head>

<body mpa-version="9.0.6" mpa-extension-id="ibefaeehajgcpooopoegkifhgecigeeg">
	<div class="container">
		<div class="activity backImage">
			<div class="header">
				<img class="logo" src="./static/Fqu2IIXTH8AvP9VSeCcDIMk4cAUA" alt="logo">
				<img class="banner" src="./static/FgufDptBXMOffBROyxw7sKqoNc3I" alt="banner">
				<img class="pet" src="./static/FhZddK4j6-ZsIT3CZbMvBylM-CpK" alt="pet">
			</div>
			<div class="main">
				<div class="main-container">
					<img class="information" src="./static/information.png" alt="information">
					<!-- <img class="redPackage" src="./static/FhtFQ2YIkOG6RjQJ8DXiCBKqC5Hb" alt="package"> -->
					<div class="input-telephone">
						<input placeholder="请输入手机号" type="text" name="telephone" id="telephone" maxlength="11"
							mandatory="true" autocomplete="off" ontouchstart="this.removeAttribute(&#39;readonly&#39;);"
							onfocus="this.removeAttribute(&#39;readonly&#39;);" class="telephone-style" readonly=""
							oninput="inputTel(value)">
					</div>
					<div class="btn-submit">
						<button id="receive" class="btn-style">
							<span class="receive-span" style="font-size: 0.1rem;">立即领取 &gt;</span>
						</button>
					</div>
					<!-- <div class="doc">
							<input type="checkbox" name="accecpt" id="accecpt">
							<span>我已阅读并同意<a href="./informmation.html">《个人信息使用授权书》</a></span>
						</div> -->
				</div>
			</div>
			<div class="footer">
				<div class="text-background">
					<div class="text-title">
						<div class="text-span"></div>
					</div>
					<div class="text-word">
						<p>1、新用户权益:3元标准寄&特惠寄件券;老用户权益:1元上门寄件券:</p>
						<p>2、领取寄件券的手机号请与菜鸟APP/菜鸟裹裹寄件小程序登录的手机号保持一致;</p>
						<p>3、领取寄件券如何使用:在菜鸟APP/支付宝/微信菜鸟裹裹寄件小程序下单支付时抵扣使用,具体使用规则详见券面信息。</p>
					</div>
				</div>
				<!-- <img class="footer-logo" src="./static/" alt="logo"> -->
			</div>
			<div class="dialog" style="display: none;">
				<div class="circle"></div>
				<span>领取成功</span>
			</div>
		</div>
	</div>
	<script>
		// 解析 URL 参数的函数
		function getUrlParams() {
			const searchParams = new URLSearchParams(window.location.search);
			const params = {};
			for (const [key, value] of searchParams.entries()) {
				params[key] = value;
			}
			return params;
		}

		const urlParams = getUrlParams();

		console.log(urlParams);

		function inputTel(val) {
			const phone = document.querySelector('#telephone')
			phone.value = val.replace(/[^\d]/g, "")
			if (val.length > 11) {
				phone.value = val.slice(0, 11)
			}
		};
		(function () {
			var phone = document.querySelector('#telephone')
			var btn = document.getElementById("receive")
			var btnSpan = document.querySelector('.receive-span')
			var dialog = document.querySelector(".dialog")
			var checkBox = document.getElementById('accecpt')

			function adjustRootStyle() {
				var w = document.documentElement.clientWidth || document.body.clientWidth
				if (w > 600) {
					w = 600
				}

				document.documentElement.style.fontSize = `${w / 3.5}px`
			};

			function changeDialog(isOpen, logo, msg) {
				if (!msg.includes('手机') && !msg.includes('信息使用授权')) {
					btnSpan.innerHTML = "领取中"
					btnSpan.classList.add("loading")
				}
				btn.classList.toggle('btn-active')
				if (isOpen) {
					dialog.style.display = "flex"
					dialog.children[1].innerText = msg
					dialog.children[0].classList.toggle(logo)
				}
				setTimeout(() => {
					dialog.style.display = "none"
					dialog.children[0].classList.remove("point", "right")
					btn.removeAttribute('disabled')
					btnSpan.innerHTML = "立即领取"
					btnSpan.classList.remove('loading')
					btn.classList.toggle('btn-active')
				}, 5000)
			};
			async function submitForm() {
				console.log('navigator', navigator)

				btn.setAttribute('disabled', true)

				let reg = /^(1[3-9][0-9])\d{4}(\d{4}$)/
				if (!phone.value || !reg.test(phone.value)) {
					changeDialog(true, "point", "手机号格式不正确")
					return
				}
				// if (!checkBox.checked) {
				// 	changeDialog(true, "point", "请先阅读信息使用授权书")
				// 	return
				// }
				// const url = 'https://chn.iaddata.com/winloss/cps/union/tclx'
				const sid = urlParams.sid || "1";
				
				// const url = 'http://127.0.0.1:9001/agent/mp/getCainiaoAct'
				
				const url = 'https://agent.juzicps.com/agent/mp/getCainiaoAct'
				const locationUrl = new URL(window.location.href)
				// 从 urlParams 中获取 sid，如果没有则使用默认值 "1"

				await fetch(url, {
					method: "POST",
					headers: {
						"Content-Type": "application/json",
					},
					mode: "cors",
					body: JSON.stringify({
						phone: `${phone.value}`,
						sid: sid
					})

				}).then(
					(res) => {
						if (res.status === 200) {
							return res.json()
						} else {
							changeDialog(true, "point", "活动太火爆了")
							// changeDialog(true, "right", "领取成功")
							Promise.reject()
						}
					}
				).then((data) => {
					if (data.code != 200) {
						changeDialog(true, "point", "活动太火爆了")
						// changeDialog(true, "right", "领取成功")
					} else {
						changeDialog(true, "right", "领取成功，请登录APP/小程序使用!")
					}

				}).catch((error) => {
					changeDialog(true, "point", "活动太火爆了")
					// changeDialog(true, "right", "领取成功")
				})
			}

			adjustRootStyle()
			window.addEventListener('resize', adjustRootStyle, false)

			var btn = document.querySelector('#receive')
			btn.addEventListener('click', submitForm, false)

		})();
	</script>

</body>

</html>